<!DOCTYPE html>
<html lang="en-US">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>$setData 扩展函数 | marathon</title>
    <meta name="generator" content="VuePress 1.8.2">  <meta name="description" content="马拉松项目，一个很牛逼的前端项目。承载着重百乃至更多的项目的基础框架建设，是公司前端规划的基石。马拉松表面的42.195公里，背后是无数个马拉松的努力，望以此与诸君共勉。">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no"> <link rel="preload" href="/assets/css/0.styles.0fd2c289.css" as="style"><link rel="preload" href="/assets/js/app.bca092fe.js" as="script"><link rel="preload" href="/assets/js/2.bcfbeac3.js" as="script"><link rel="preload" href="/assets/js/4.59c3b4a1.js" as="script"><link rel="preload" href="/assets/js/5.74bd5f86.js" as="script"><link rel="prefetch" href="/assets/js/3.1c9abd66.js"><link rel="prefetch" href="/assets/js/6.68edde6e.js"><link rel="prefetch" href="/assets/js/7.d92464eb.js"><link rel="prefetch" href="/assets/js/8.346cd128.js"><link rel="prefetch" href="/assets/js/9.4812d203.js"> <link rel="stylesheet" href="/assets/css/0.styles.0fd2c289.css">
</head>

<body>
    <div id="app" data-server-rendered="true"><div class="theme-container"><div><header><div class="note-row layout-header"><div class="note-col note-navbar-left"><button type="button" class="sidebar-button"><span class="sidebar-button-content"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" viewBox="0 0 448 512" class="icon"><path fill="currentColor" d="M436 124H12c-6.627 0-12-5.373-12-12V80c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12z"></path></svg></span></button> <a href="/" class="home-link router-link-active"><span class="site-name">marathon</span></a></div> <div class="note-col note-navbar-right"><div class="search" style="width:30%;"><div class="searchbox"><div class="searchbox-icon"><svg t="1587518432004" color="rgba(0,0,0,.6)" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1873" class="icon"><path d="M946.155051 895.382691l-186.037067-186.032974c56.195883-67.547419 89.998757-154.376996 89.998757-249.113661 0-215.247342-174.49315-389.741515-389.746632-389.741515-215.247342 0-389.741515 174.49315-389.741515 389.741515 0 215.252459 174.49315 389.746632 389.741515 389.746632 95.768157 0 183.461405-34.540677 251.317862-91.841731l185.853895 185.853895c6.710842 6.714935 15.505136 10.067286 24.304546 10.067286 8.794293 0 17.593703-3.357468 24.307615-10.067286C959.576735 930.575214 959.576735 908.808468 946.155051 895.382691L946.155051 895.382691zM460.370109 781.233907c-43.363623 0-85.392856-8.476045-124.920104-25.195845-38.217417-16.166191-72.554456-39.321564-102.054327-68.821435-29.504988-29.504988-52.655244-63.836911-68.821435-102.054327-16.720823-39.529295-25.195845-81.561597-25.195845-124.925221 0-43.363623 8.476045-85.392856 25.195845-124.925221 16.166191-38.2123 39.316447-72.550363 68.821435-102.050234 29.499871-29.504988 63.836911-52.66036 102.054327-68.821435 39.528272-16.7198 81.556481-25.195845 124.920104-25.195845s85.395926 8.476045 124.925221 25.195845c38.217417 16.161075 72.554456 39.316447 102.054327 68.821435 29.499871 29.499871 52.655244 63.831794 68.820412 102.050234 16.721847 39.529295 25.196869 81.561597 25.196869 124.925221 0 43.363623-8.476045 85.395926-25.196869 124.925221-16.164145 38.217417-39.315424 72.550363-68.820412 102.054327-29.499871 29.499871-63.836911 52.655244-102.054327 68.821435C545.767058 772.758885 503.734756 781.233907 460.370109 781.233907L460.370109 781.233907zM460.370109 781.233907" p-id="1874"></path></svg></div> <div class="searchbox-content"><input type="text" name="search" autocomplete="off" aria-label="Search" value=""></div> <!----></div></div> <div class="navlinks can-hide"><!----></div></div></div></header> <main><div class="note-sidebar animated fadeInLeft faster"> <ul class="note-sidebar-links"><li><a href="/component/m-table.html" class="sidebar-link">M-Table 增强实现</a></li><li><a href="/directvie/m-delay.html" class="sidebar-link">v-MDelay 按钮节流指令</a></li><li><a href="/extend/setData.html" aria-current="page" class="active sidebar-link">$setData 扩展函数</a><ul class="sidebar-sub-headers"></ul></li></ul> </div> <div class="note-page" style="padding-left:252px;"> <div class="theme-note-content content__default"><p>this.$setData(@data,@putWay='full')</p> <h4 id="有什么用"><a href="#有什么用" class="header-anchor">#</a> 有什么用 ？</h4> <blockquote><p>好像没什么用！看起来有点像react的setState。开发它主要是为了解决一些对象赋值时出现的不友好情况。</p></blockquote> <h3 id="使用实例"><a href="#使用实例" class="header-anchor">#</a> 使用实例</h3> <div class="demo-block demo-extend demo-setData.html"><div class="source"><div><div><p>{</p> <div class="json-block"><label class="json-title">home : </label> <span class="json-val">&quot;true&quot;</span></div><div class="json-block"><label class="json-title">heroImage : </label> <span class="json-val">&quot;/hero.png&quot;</span></div> <p>}</p> <div><button type="button" class="el-button el-button--default"><!----><!----><span>inside</span></button> <button type="button" class="el-button el-button--default"><!----><!----><span>new</span></button> <button type="button" class="el-button el-button--default"><!----><!----><span>full</span></button> <button type="button" class="el-button el-button--primary"><!----><!----><span>重置</span></button></div></div></div></div> <div class="meta"><!----> <div class="highlight"><div class="language-js extra-class"><pre class="language-js"><code><span class="token operator">&lt;</span>template<span class="token operator">&gt;</span>
   <span class="token operator">&lt;</span>div<span class="token operator">&gt;</span>
      <span class="token operator">&lt;</span>p<span class="token operator">&gt;</span><span class="token punctuation">{</span><span class="token operator">&lt;</span><span class="token operator">/</span>p<span class="token operator">&gt;</span>
        <span class="token operator">&lt;</span>div <span class="token keyword">class</span><span class="token operator">=</span><span class="token string">&quot;json-block&quot;</span> v<span class="token operator">-</span><span class="token keyword">for</span><span class="token operator">=</span><span class="token string">&quot;(val,k) of raw&quot;</span><span class="token operator">&gt;</span>
          <span class="token operator">&lt;</span>label <span class="token keyword">class</span><span class="token operator">=</span><span class="token string">&quot;json-title&quot;</span><span class="token operator">&gt;</span><span class="token punctuation">{</span><span class="token punctuation">{</span>k<span class="token punctuation">}</span><span class="token punctuation">}</span> <span class="token operator">:</span> <span class="token operator">&lt;</span><span class="token operator">/</span>label<span class="token operator">&gt;</span> 
          <span class="token operator">&lt;</span>span <span class="token keyword">class</span><span class="token operator">=</span><span class="token string">&quot;json-val&quot;</span><span class="token operator">&gt;</span><span class="token string">&quot;{{val}}&quot;</span><span class="token operator">&lt;</span><span class="token operator">/</span>span<span class="token operator">&gt;</span>
        <span class="token operator">&lt;</span><span class="token operator">/</span>div<span class="token operator">&gt;</span>
      <span class="token operator">&lt;</span>p<span class="token operator">&gt;</span><span class="token punctuation">}</span><span class="token operator">&lt;</span><span class="token operator">/</span>p<span class="token operator">&gt;</span>        
     <span class="token operator">&lt;</span>div<span class="token operator">&gt;</span>
       <span class="token operator">&lt;</span>el<span class="token operator">-</span>button @click<span class="token operator">=</span><span class="token string">&quot;onInset&quot;</span><span class="token operator">&gt;</span>inside<span class="token operator">&lt;</span><span class="token operator">/</span>el<span class="token operator">-</span>button<span class="token operator">&gt;</span>
       <span class="token operator">&lt;</span>el<span class="token operator">-</span>button @click<span class="token operator">=</span><span class="token string">&quot;onNew&quot;</span><span class="token operator">&gt;</span><span class="token keyword">new</span><span class="token operator">&lt;</span><span class="token operator">/</span>el<span class="token operator">-</span>button<span class="token operator">&gt;</span>
       <span class="token operator">&lt;</span>el<span class="token operator">-</span>button @click<span class="token operator">=</span><span class="token string">&quot;onFull&quot;</span><span class="token operator">&gt;</span>full<span class="token operator">&lt;</span><span class="token operator">/</span>el<span class="token operator">-</span>button<span class="token operator">&gt;</span>
       <span class="token operator">&lt;</span>el<span class="token operator">-</span>button @click<span class="token operator">=</span><span class="token string">&quot;onReset&quot;</span> type<span class="token operator">=</span><span class="token string">&quot;primary&quot;</span><span class="token operator">&gt;</span>重置<span class="token operator">&lt;</span><span class="token operator">/</span>el<span class="token operator">-</span>button<span class="token operator">&gt;</span>
     <span class="token operator">&lt;</span><span class="token operator">/</span>div<span class="token operator">&gt;</span>
   <span class="token operator">&lt;</span><span class="token operator">/</span>div<span class="token operator">&gt;</span>
<span class="token operator">&lt;</span><span class="token operator">/</span>template<span class="token operator">&gt;</span>

<span class="token operator">&lt;</span>script<span class="token operator">&gt;</span>
  <span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
    <span class="token function">data</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span>
      <span class="token keyword">return</span><span class="token punctuation">{</span>
        raw<span class="token operator">:</span><span class="token punctuation">{</span>
          home<span class="token operator">:</span> <span class="token boolean">true</span><span class="token punctuation">,</span>
          heroImage<span class="token operator">:</span> <span class="token string">'/hero.png'</span><span class="token punctuation">,</span>
        <span class="token punctuation">}</span><span class="token punctuation">,</span>
        rawBak<span class="token operator">:</span><span class="token punctuation">{</span>
            
        <span class="token punctuation">}</span><span class="token punctuation">,</span>
      <span class="token punctuation">}</span>
    <span class="token punctuation">}</span><span class="token punctuation">,</span>
    <span class="token function">created</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span>
        <span class="token keyword">this</span><span class="token punctuation">.</span>rawBak <span class="token operator">=</span> <span class="token punctuation">{</span><span class="token operator">...</span><span class="token keyword">this</span><span class="token punctuation">.</span>raw<span class="token punctuation">}</span>
    <span class="token punctuation">}</span><span class="token punctuation">,</span>    
    methods<span class="token operator">:</span><span class="token punctuation">{</span>
        <span class="token comment">//假装调用接口了</span>
        <span class="token function">getData</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span>
            <span class="token keyword">const</span> result <span class="token operator">=</span><span class="token punctuation">{</span>
                  home<span class="token operator">:</span> <span class="token boolean">true</span><span class="token punctuation">,</span>
                  heroImage<span class="token operator">:</span> <span class="token string">'/new/hero.png'</span><span class="token punctuation">,</span>
                  heroText<span class="token operator">:</span> <span class="token string">'Hero 标题'</span><span class="token punctuation">,</span>
                  tagline<span class="token operator">:</span> <span class="token string">'Hero 副标题'</span><span class="token punctuation">,</span>
                  actionText<span class="token operator">:</span> <span class="token string">'快速上手 →'</span><span class="token punctuation">,</span>
                  actionLink<span class="token operator">:</span> <span class="token string">'/zh/guide/'</span><span class="token punctuation">,</span>
                  features<span class="token operator">:</span><span class="token string">&quot;Fast、Sort&quot;</span><span class="token punctuation">,</span>
                  title<span class="token operator">:</span><span class="token string">&quot;简洁至上&quot;</span><span class="token punctuation">,</span>
                  details<span class="token operator">:</span><span class="token string">'以 Markdown 为中心的项目结构，以最少的配置帮助你专注于写作'</span><span class="token punctuation">,</span>
                  footer<span class="token operator">:</span><span class="token string">'Copyright © 2018-present'</span>
                <span class="token punctuation">}</span>
            <span class="token keyword">return</span> <span class="token keyword">new</span> <span class="token class-name">Promise</span><span class="token punctuation">(</span><span class="token parameter">resolve</span><span class="token operator">=&gt;</span><span class="token function">resolve</span><span class="token punctuation">(</span>result<span class="token punctuation">)</span><span class="token punctuation">)</span>    
        <span class="token punctuation">}</span><span class="token punctuation">,</span>
      
        <span class="token function">onReset</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span>
            <span class="token keyword">this</span><span class="token punctuation">.</span>raw <span class="token operator">=</span> <span class="token punctuation">{</span><span class="token operator">...</span><span class="token keyword">this</span><span class="token punctuation">.</span>rawBak<span class="token punctuation">}</span>    
        <span class="token punctuation">}</span><span class="token punctuation">,</span>
        <span class="token function">onInset</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span>
            
            <span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">getData</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span><span class="token parameter">resp</span><span class="token operator">=&gt;</span><span class="token punctuation">{</span>
              <span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">onReset</span><span class="token punctuation">(</span><span class="token punctuation">)</span>
              <span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">$setData</span><span class="token punctuation">(</span><span class="token punctuation">{</span>raw<span class="token operator">:</span>resp<span class="token punctuation">}</span><span class="token punctuation">,</span><span class="token string">'inside'</span><span class="token punctuation">)</span>
            <span class="token punctuation">}</span><span class="token punctuation">)</span> 
              
        <span class="token punctuation">}</span><span class="token punctuation">,</span>
        <span class="token function">onNew</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span>
          <span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">getData</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span><span class="token parameter">resp</span><span class="token operator">=&gt;</span><span class="token punctuation">{</span>
            <span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">onReset</span><span class="token punctuation">(</span><span class="token punctuation">)</span>
            <span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">$setData</span><span class="token punctuation">(</span><span class="token punctuation">{</span>raw<span class="token operator">:</span>resp<span class="token punctuation">}</span><span class="token punctuation">,</span><span class="token string">'new'</span><span class="token punctuation">)</span>
          <span class="token punctuation">}</span><span class="token punctuation">)</span> 
        <span class="token punctuation">}</span><span class="token punctuation">,</span>
        <span class="token function">onFull</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span>
          <span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">getData</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span><span class="token parameter">resp</span><span class="token operator">=&gt;</span><span class="token punctuation">{</span>
            <span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">onReset</span><span class="token punctuation">(</span><span class="token punctuation">)</span>
            <span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">$setData</span><span class="token punctuation">(</span><span class="token punctuation">{</span>raw<span class="token operator">:</span>resp<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span><span class="token parameter">_</span><span class="token operator">=&gt;</span><span class="token punctuation">{</span>
              console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span><span class="token string">&quot;this is a promise object! do what you want.&quot;</span><span class="token punctuation">)</span>
            <span class="token punctuation">}</span><span class="token punctuation">)</span>
          <span class="token punctuation">}</span><span class="token punctuation">)</span>
        <span class="token punctuation">}</span>     
    <span class="token punctuation">}</span>
<span class="token punctuation">}</span>
<span class="token operator">&lt;</span><span class="token operator">/</span>script<span class="token operator">&gt;</span>
<span class="token operator">&lt;</span>style<span class="token operator">&gt;</span>
   <span class="token punctuation">.</span>json<span class="token operator">-</span>block<span class="token punctuation">{</span>
       padding<span class="token operator">-</span>left<span class="token operator">:</span><span class="token number">30</span>px<span class="token punctuation">;</span>
        <span class="token punctuation">}</span>  
   <span class="token punctuation">.</span>json<span class="token operator">-</span>title<span class="token punctuation">{</span>
       color<span class="token operator">:</span>#<span class="token number">000</span><span class="token punctuation">;</span>
       font<span class="token operator">-</span>size<span class="token operator">:</span><span class="token number">14</span>px<span class="token punctuation">;</span>
      <span class="token punctuation">}</span>    
   <span class="token punctuation">.</span>json<span class="token operator">-</span>val<span class="token punctuation">{</span>
       color<span class="token operator">:</span>#<span class="token number">888</span><span class="token punctuation">;</span>
       padding<span class="token operator">-</span>left<span class="token operator">:</span><span class="token number">5</span>px<span class="token punctuation">;</span>
        font<span class="token operator">-</span>size<span class="token operator">:</span><span class="token number">16</span>px<span class="token punctuation">;</span>
      <span class="token punctuation">}</span>     
<span class="token operator">&lt;</span><span class="token operator">/</span>style<span class="token operator">&gt;</span>
</code></pre></div></div></div> <div class="demo-block-control"><i class="el-icon-caret-bottom"></i> <span style="display:none;">展开</span></div></div><h3 id="场景举例"><a href="#场景举例" class="header-anchor">#</a> 场景举例</h3> <blockquote><p>这是一个相对不友好，但又不够极端的案例。赋值和不需要赋值的属性五五开，不好办！</p></blockquote> <div class="language-js extra-class"><pre class="language-js"><code>  <span class="token function">data</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span>
    <span class="token keyword">return</span><span class="token punctuation">{</span>
        options<span class="token operator">:</span><span class="token punctuation">{</span>
          home<span class="token operator">:</span> <span class="token boolean">true</span><span class="token punctuation">,</span>
          heroImage<span class="token operator">:</span> <span class="token string">'/hero.png'</span><span class="token punctuation">,</span>
          heroText<span class="token operator">:</span> <span class="token string">'Hero 标题'</span><span class="token punctuation">,</span>
          tagline<span class="token operator">:</span> <span class="token string">'Hero 副标题'</span><span class="token punctuation">,</span>
          actionText<span class="token operator">:</span> <span class="token string">'快速上手 →'</span><span class="token punctuation">,</span>
          actionLink<span class="token operator">:</span> <span class="token string">'/zh/guide/'</span><span class="token punctuation">,</span>
          features<span class="token operator">:</span><span class="token string">&quot;&quot;</span><span class="token punctuation">,</span>
          title<span class="token operator">:</span><span class="token string">&quot;简洁至上&quot;</span><span class="token punctuation">,</span>
          details<span class="token operator">:</span><span class="token string">'以 Markdown 为中心的项目结构，以最少的配置帮助你专注于写作'</span><span class="token punctuation">,</span>
          footer<span class="token operator">:</span><span class="token string">'Copyright © 2018-present'</span>
        <span class="token punctuation">}</span>
    <span class="token punctuation">}</span>
  <span class="token punctuation">}</span><span class="token punctuation">,</span>
  methods<span class="token operator">:</span><span class="token punctuation">{</span>
      <span class="token function">changeOpt</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span>
          <span class="token comment">//看重点，码字不易 --&gt;</span>
          Http<span class="token punctuation">.</span><span class="token function">get</span><span class="token punctuation">(</span><span class="token string">'/api/options'</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span><span class="token parameter">resp</span><span class="token operator">=&gt;</span><span class="token punctuation">{</span>
            <span class="token keyword">this</span><span class="token punctuation">.</span>options<span class="token punctuation">.</span>home <span class="token operator">=</span> resp<span class="token punctuation">.</span>home<span class="token punctuation">;</span>  
            <span class="token keyword">this</span><span class="token punctuation">.</span>options<span class="token punctuation">.</span>heroImage <span class="token operator">=</span> resp<span class="token punctuation">.</span>heroImage<span class="token punctuation">;</span>
            <span class="token keyword">this</span><span class="token punctuation">.</span>options<span class="token punctuation">.</span>heroText <span class="token operator">=</span> resp<span class="token punctuation">.</span>heroText<span class="token punctuation">;</span>
            <span class="token keyword">this</span><span class="token punctuation">.</span>options<span class="token punctuation">.</span>tagline <span class="token operator">=</span> resp<span class="token punctuation">.</span>tagline<span class="token punctuation">;</span>
            <span class="token keyword">this</span><span class="token punctuation">.</span>options<span class="token punctuation">.</span>actionLink <span class="token operator">=</span> resp<span class="token punctuation">.</span>actionLink<span class="token punctuation">;</span>
          <span class="token punctuation">}</span><span class="token punctuation">)</span>
      <span class="token punctuation">}</span>
  <span class="token punctuation">}</span>

</code></pre></div><h4 id="改造后"><a href="#改造后" class="header-anchor">#</a> 改造后</h4> <h5 id=""><a href="#" class="header-anchor">#</a></h5> <div class="language-js extra-class"><pre class="language-js"><code>
<span class="token function">data</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span>
  <span class="token keyword">return</span><span class="token punctuation">{</span>
    options<span class="token operator">:</span><span class="token punctuation">{</span>
      home<span class="token operator">:</span> <span class="token boolean">true</span><span class="token punctuation">,</span>
      heroImage<span class="token operator">:</span> <span class="token string">'/hero.png'</span><span class="token punctuation">,</span>
      heroText<span class="token operator">:</span> <span class="token string">'Hero 标题'</span><span class="token punctuation">,</span>
      tagline<span class="token operator">:</span> <span class="token string">'Hero 副标题'</span><span class="token punctuation">,</span>
      actionText<span class="token operator">:</span> <span class="token string">'快速上手 →'</span><span class="token punctuation">,</span>
      actionLink<span class="token operator">:</span> <span class="token string">'/zh/guide/'</span><span class="token punctuation">,</span>
      features<span class="token operator">:</span><span class="token punctuation">[</span><span class="token punctuation">]</span><span class="token punctuation">,</span>
      title<span class="token operator">:</span><span class="token string">&quot;简洁至上&quot;</span><span class="token punctuation">,</span>
      details<span class="token operator">:</span><span class="token string">'以 Markdown 为中心的项目结构，以最少的配置帮助你专注于写作'</span><span class="token punctuation">,</span>
      footer<span class="token operator">:</span><span class="token string">'Copyright © 2018-present'</span>
    <span class="token punctuation">}</span>
  <span class="token punctuation">}</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span>
methods<span class="token operator">:</span><span class="token punctuation">{</span>
  <span class="token function">changeOpt</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span>
    <span class="token comment">//看重点 --&gt;</span>
    Http<span class="token punctuation">.</span><span class="token function">get</span><span class="token punctuation">(</span><span class="token string">'/api/options'</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span><span class="token parameter">resp</span><span class="token operator">=&gt;</span><span class="token punctuation">{</span>
      <span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">$setData</span><span class="token punctuation">(</span><span class="token punctuation">{</span>options<span class="token operator">:</span>resp<span class="token punctuation">}</span><span class="token punctuation">)</span>  
    <span class="token punctuation">}</span><span class="token punctuation">)</span>
  <span class="token punctuation">}</span>
<span class="token punctuation">}</span>
</code></pre></div><h3 id="参数说明"><a href="#参数说明" class="header-anchor">#</a> 参数说明</h3> <blockquote><p>@data --新的值对象<br>
@putWay --赋值模式，支持以下3种，分别是：</p> <blockquote><p>full   --全量（默认），<br>
inside --仅编辑被赋值对象所包含的属性，<br>
new    --仅编辑新增属性</p></blockquote> <p>return: Promise</p></blockquote> <h3 id="后记"><a href="#后记" class="header-anchor">#</a> 后记</h3> <blockquote><p>不想抠代码，就放心用吧。</p></blockquote></div> <div class="box" data-v-49b98ccd><div data-v-49b98ccd><div class="tag-link" data-v-49b98ccd>使用实例</div></div><div data-v-49b98ccd><div class="tag-link" data-v-49b98ccd>场景举例</div></div><div data-v-49b98ccd><div class="tag-link" data-v-49b98ccd>参数说明</div></div><div data-v-49b98ccd><div class="tag-link" data-v-49b98ccd>后记</div></div></div> <!----> </div></main></div></div><div class="global-ui"><!----></div></div>
    <script src="/assets/js/app.bca092fe.js" defer></script><script src="/assets/js/2.bcfbeac3.js" defer></script><script src="/assets/js/4.59c3b4a1.js" defer></script><script src="/assets/js/5.74bd5f86.js" defer></script>
</body>

</html>